import {getEnv} from '../utils/env.js'
import {deepClone, assign, isEmpty} from '../utils/index.js'

let fixedConf = {
  __config__: {
    showUpBtn: false,
    showDownBtn: false,
    showDeleteButton: false,
    canDraggable: false,
  },
};

let input ={
  // 组件的自定义配置
  __config__: {
    name: '单行文本',
    label: "单行文本",
    labelPosition: 'top',
    showLabel: true,
    tag: "el-input",
    tagIcon: "input",
    defaultValue: undefined,
    layout: "colFormItem",
    span: 24,
    required: false,
    // 新增配置
    validateType: null,
    min: -99999,
    max: 99999,
    validator: function (rule, value, callback) {
      if(isEmpty(value)){
        return callback();
      }
      // console.log('rule',rule, 'value',value)
      let regMap = {
        number: {
          reg: /^(\-|\+)?\d+(\.\d+)?$/,
          msg: "请输入数字值"
        },
        integer: {
          reg: /^-?\d+$/,
          msg: "请输入整数"
        }
      }
      let o = regMap[this.config.validateType]
      if(o){
        if(!o.reg.test(value)){
          callback(new Error(o.msg));
        }else{
          let {min, max} = this.config
          if(!isEmpty(min) && parseFloat(value) < parseFloat(min)){
            callback(new Error("不能小于"+min))
          }else if(!isEmpty(max) && parseFloat(value) > parseFloat(max)){
            callback(new Error("不能大于"+max))
          }else{
            callback()
          }
        }
      }else{
        callback();
      }
    },
  },
  // 其余的为可直接写在组件标签上的属性
  placeholder: "请输入",
  maxlength: null,
}
export function getInput(source, isDefault = true) {
  // console.log("baseComponents", baseComponents);
  let target = deepClone(input);
  if (isDefault) {
    assign(target, deepClone(fixedConf));
  }
  assign(target, { __config__: { draggable: true } });
  assign(target, source);
  return target;
}

let text =   {
  __config__: {
    name: '文本',
    label: '文本',
    width: '200px',
    align: '',
    showLabel: false,
    showLabelChange: false,
    tag: 'ts-text',
    tagIcon: 'text',
    defaultValue: undefined,
    layout: 'colFormItem',
    span: 24,
  },
  // 组件的插槽属性
  __slot__: {
    span: '文本'
  },
  // 其余的为可直接写在组件标签上的属性
  style: {
    width: '100%',
    lineHeight: '36px',
    fontSize: '14px',
    textAlign: 'left',
    color: '#0E0E0F',
    fontWeight: 'normal'
  }
}
export function getText(source, isDefault = true) {
  let target = deepClone(text);
  if (isDefault) {
    assign(target, deepClone(fixedConf));
  }
  assign(target, { __config__: { draggable: true } });
  assign(target, source);
  return target;
}

export function getTextarea(source, isDefault = true) {
  let target = deepClone(
    baseComponents.find((t) => t.__config__.label === "多行文本")
  );
  if (isDefault) {
    assign(target, {
      __config__: {
        labelPosition: "left",
      },
    });
    assign(target, deepClone(fixedConf));
  }
  assign(target, { __config__: { draggable: true } });
  assign(target, source);
  return target;
}

export function getSelect(source, isDefault = true) {
  let target = deepClone(
    baseComponents.find((t) => t.__config__.label === "下拉列表")
  );
  if (isDefault) {
    assign(target, {
      __config__: { showOptionChange: false },
    });
    assign(target, deepClone(fixedConf));
  }
  if (target.__slot__ && target.__slot__.options) target.__slot__.options = [];
  assign(target, { __config__: { draggable: true } });
  assign(target, source);
  return target;
}

export function getRadioGroup(source, isDefault = true) {
  let target = deepClone(
    baseComponents.find((t) => t.__config__.label === "单选框组")
  );
  if (isDefault) {
    assign(target, {
      __config__: { showOptionChange: false },
    });
    assign(target, deepClone(fixedConf));
  }
  assign(target, { __config__: { draggable: true } });
  assign(target, source);
  return target;
}

export function getCheckboxGroup(source, isDefault = true) {
  let target = deepClone(
    baseComponents.find((t) => t.__config__.label === "多选框组")
  );
  if (isDefault) {
    assign(target, {
      __config__: { showOptionChange: false },
    });
    assign(target, deepClone(fixedConf));
  }
  assign(target, { __config__: { draggable: true } });
  assign(target, source);
  return target;
}

export function getImgUpload(source, isDefault = true) {
  let target = deepClone(
    baseComponents.find((t) => t.__config__.label === "图片上传")
  );
  if (isDefault) {
    assign(target, deepClone(fixedConf));
  }
  assign(target, { __config__: { draggable: true } });
  assign(target, source);
  return target;
}

// 基础组件 【左面板】
let baseComponents  = [
  {
    __config__: {
      name: "框体卡片",
      label: "框体卡片",
      group: 'item',
      layout: "tsCard",
      showLabel: false,
      tag: "el-card",
      tagIcon: "card",
      defaultValue: undefined,
      showSpanChange: false,
      span: 24,
      children: {
        span: 24,
        cardHeader: [
          getText({
            __config__: {
              showLabelChange: false,
              showSpanChange: false,
              label: '卡片名称'},
            __slot__: {
              span: '自定义卡片,如[用地评审]'
            },
            style: {
              fontSize: '18px',
              lineHeight: '26px',
              fontWeight: 'bold'
            }
          })
        ],
        cardBody: [],
      },
    },
  },
  text,
  {
    __config__: {
      name: '超链接',
      label: '超链接',
      showLabel: false,
      showLabelChange: false,
      tag: 'el-link',
      tagIcon: 'text',
      layout: 'colFormItem',
      span: 24,
    },
    __slot__: {
      default: '超链接'
    },
    target: '_blank',
    href: '',
    underline: true,
    type: 'primary'
  },
  input,
  {
    __config__: {
      name: '多行文本',
      label: "多行文本",
      showLabel: true,
      tag: "el-input",
      tagIcon: "textarea",
      defaultValue: undefined,
      layout: "colFormItem",
      span: 24,
      labelPosition: "top",
      required: false
    },
    type: "textarea",
    placeholder: "请输入",
    autosize: {
      minRows: 4,
      maxRows: 4,
    },
    maxlength: null,
  },
  {
    __config__: {
      draggable: false,
      name: '图片上传',
      label: "图片上传",
      tag: "ts-img-upload",
      tagIcon: "upload-img",
      layout: "colFormItem",
      showLabel: true,
      showModel: false,
      span: 24,
      labelPosition: "top",
      required: false,
      validator: function (rule, value, callback) {
        console.log('config',this.config)
        console.log('value',value)
        callback();
      }
    },
    isShowTip: true,
    limit: undefined
  },
  {
    __config__: {
      name: '附件上传',
      label: "附件上传",
      tag: "ts-upload",
      tagIcon: "upload",
      layout: "colFormItem",
      showModel: false,
      showLabel: true,
      span: 24,
      labelPosition: "top"
    },
    limit: undefined
  },
  {
    __config__: {
      name: "下拉列表",
      label: "下拉列表",
      showLabel: true,
      labelPosition: 'top',
      tag: "el-select",
      tagIcon: "select",
      layout: "colFormItem",
      defaultValue: undefined,
      span: 24,
      required: false
    },
    __slot__: {
      options: [
        {
          label: "选项一",
          value: '1',
        },
        {
          label: "选项二",
          value: '2',
        },
      ]
    },
    placeholder: "请选择",
    style: { width: '100%' },
    multiple: false,
    clearable: true
  },
  {
    __config__: {
      name: "单选框组",
      label: "单选框组",
      labelPosition: 'top',
      showLabel: true,
      tag: "el-radio-group",
      tagIcon: "select",
      layout: "colFormItem",
      defaultValue: undefined,
      span: 24,
      required: false,
    },
    __slot__: {
      options: [
        {
          label: "选项一",
          value: '1',
        },
        {
          label: "选项二",
          value: '2',
        },
      ],
    },
    style: { width: "100%" },
  },
  {
    __config__: {
      name: "多选框组",
      label: "多选框组",
      labelPosition: 'top',
      showLabel: true,
      tag: "el-checkbox-group",
      tagIcon: "select",
      layout: "colFormItem",
      defaultValue: [],
      span: 24,
      required: false,
    },
    __slot__: {
      options: [
        {
          label: "选项一",
          value: '1',
        },
        {
          label: "选项二",
          value: '2',
        },
      ]
    },
    style: { width: "100%" },
  },
  {
    __config__: {
      layout: 'colFormItem',
      tagIcon: 'table',
      tag: 'table-sheet',
      span: 24,
      label: '电子表格',
      labelPosition: "top",
      showLabel: true,
      showSpanChange: false,
      showLabelWidthChange: false,
      labelWidth: null,
    },
    data: {},
    height: 400
  }
]
export default baseComponents;

/*
let test = getText({
  __config__: {label: '卡片名称'},
  __slot__: {
    span: '自定义卡片,如[用地评审]'
  },
})
console.log('test', test)
*/
